<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>【trip网】出境游_旅游攻略_自助游攻略_游记攻略_境外旅游 旅途永无止尽</title>
    <link rel="stylesheet" href="css/loginIndex.css"/>
    <link rel="icon" href="loginImages/app_qyer.png"/>
    <script>
        setInterval(function(){
            var tt=document.title;
            document.title=tt.substr(1)+tt.charAt(0);

        },50);
    </script>
</head>
<body>
<div class="layer" id='layer'>
    <!--<ul id="move">-->
        <!--<li><img src="loginImages/wallhaven-32251.jpg" width="1360" height="750"></li>-->
        <!--<li><img src="loginImages/wallhaven-188425.jpg"  width="1360" height="750"></li>-->

        <!--<li><img src="loginImages/web_login_bg.jpg"  width="1360" height="750"></li>-->
        <!--<li><img src="loginImages/Cache_-5b9cd2c396bb6534..jpg"  width="1360" height="750"></li>-->
        <!--<li><img src="loginImages/wallhaven-32251.jpg"  width="1360" height="750"></li>-->
    <!--</ul>-->
    <div class="main">
        <div class="logo">
            <em style="font-size: 40px; color: white; font-family: 'rockwell extra bold';">Trip    <span style="font-size: 30px;">注册</span></em>
            <em class='logo_em'></em>
        </div>x

        <div id="register">
            <div class="box bo_rg">
                <div id="phone_register" class="clearfix">
                    <a href="#" class="current">邮箱登录</a>
                    <a href="#">手机登录</a>
                </div>
                <div id="big">
                    <div class="no current">
                        <div class="email_add clearfix">
                            <input type="text" placeholder="输入用于登录的邮箱地址">
                            <em></em>
                        </div>
                        <div class="password">
                            <input type="password" placeholder="密码">
                            <em></em>
                        </div>
                        <div class="yanzheng clearfix">
                            <input type="text" placeholder="图片验证码">
                            <input type="text" class="txt" id='code' readonly>
                            <em></em>  <a href="#" class='em'>忘记密码</a>
                        </div>
                    </div>
                    <div class="no">
                        <div class="email_add clearfix">
                            <input type="text" id='first_phone' placeholder="输入用于登录的手机号码">
                            <em></em>
                        </div>
                        <div class="password">
                            <input type="password" placeholder="密码">
                            <em></em>
                        </div>
                        <div class="yanzheng clearfix">
                            <input type="text" placeholder="图片验证码">
                            <input type="text" class="txt" id='code1' readonly>
                            <em></em>   <a href="#" class='em'>忘记密码</a>
                        </div>
                    </div>
                </div>

                <button class="ensure"><a href="member_set.html">登录</a></button>
                 <div id="rem"><input type="checkbox" checked>记住我</div>
                 <div id="choose">
                     <a href="#" id='img1'></a>
                     <a href="#" id='img2'></a>
                     <a href="#" id='img3'></a>
                     <a href="#" id='img4'></a>
                 </div>
                <div class="has">
                    <em>用户名登录</em>
                    <i>|</i>
                    <a href="#">境外手机号登录</a>
                    <span>
                        <a id='a' href="registerIndex.html">立即注册</a>

                    </span>
                </div>

            </div>




        </div>

    </div>
</div>

<div class="regi_bottom clearfix">
    <div class="regi_top clearfix">
        <div class="left">
            <dl>
                <dt>关于我们</dt>
                <dd><a href="#">trip简介</a></dd>
                <dd><a href="#">联系我们</a></dd>
                <dd><a href="#">合作伙伴</a></dd>

            </dl>
            <dl>
                <dt>加入trip</dt>
                <dd><a href="#">招聘职位</a></dd>


            </dl>
            <dl>
                <dt>网站条款</dt>
                <dd><a href="#">会员条款</a></dd>
                <dd><a href="#">社区指南</a></dd>
                <dd><a href="#">版权声明</a></dd>
                <dd><a href="#">合作伙伴</a></dd>
            </dl>
            
        </div>
        <div class="right">
            <span>关注我们</span>
            <div class="tu">
                <a href="#" class="a1"></a>
                <a href="#" class="a2"></a>
                <a href="#" class="a3"></a>
                <a href="#" class="a4"></a>
                <a href="#" class="a5"></a>
                <a href="#" class="a6"></a>
            </div>
        </div>
    </div>

    <div class="bot">
       
        <p>2004-2015 © trip网™ qyer.com All rights reserved.京公网安备11010502023470</p>
        <p>trip网为旅行者提供原创实用的出境游旅行指南和旅游攻略、旅行社区和问答交流平台，并提供签证、保险、机票、酒店预订、租车等服务</p>
    </div>
</div>
<div class="fix" id='fix'>
    <span></span>
</div>
<div id="feedback">
    <span></span>
    <div id="feed">
     <div id="feed_top">
         <textarea id="feed_txt" cols="30" rows="10">
           aaaaaaa
         </textarea>
         <div id=feed_bot>
             <em>联系方式</em>
             <input type="text" id="" placeholder="请将您的邮箱或手机号码告诉我们">
         </div>

     </div>
    </div>
</div>
<script src='jquery-1.12.4.js'></script>
<script>
    var tab=document.getElementById('phone_register');
    var as=tab.getElementsByTagName('a');
    var big=document.getElementById('big');
    var divs=big.getElementsByClassName('no');
    for(var i=0;i<as.length;i++)
    {   as[i].index=i;
        as[i].onclick=function()
        {
            for(var j=0;j<as.length;j++)
            {
                as[j].className="";
                divs[j].className="no";
            }
            this.className='current';
            divs[this.index].className='no current';
        }
    }

    $('.email_add>input')[0].onblur=function()
    {
        if(this.value=="")
        {this.nextElementSibling.innerHTML='必须登录的邮箱号';
            this.nextElementSibling.className='name1';

        }
        else{
            if(/^[0-9a-zA-Z_.-]+[@][0-9a-zA-Z_]+([.][a-zA-Z]+){1,2}$/.test(this.value))
            {
                this.style.background='url(loginImages/right.png) no-repeat right';

                this.nextElementSibling.innerHTML='';
                this.nextElementSibling.className='';
            }
            else{
                this.nextElementSibling.className='name1';
                this.nextElementSibling.innerHTML='登录的邮箱地址格式错误';
                this.style.background='';
            }
        }


    }
    $('.email_add>input')[1].onblur=function()
    {
          if(this.value=="")
          {this.nextElementSibling.innerHTML='必须登录的手机号';
              this.nextElementSibling.className='name1';

          }
        else{
              if(/^1[34578][0-9][0-9]{8}$/.test(this.value))
              {
                  this.style.background='url(loginImages/right.png) no-repeat right';

                  this.nextElementSibling.innerHTML='';
                  this.nextElementSibling.className='';
              }
              else{
                  this.nextElementSibling.className='name1';
                  this.nextElementSibling.innerHTML='登录的手机格式错误';
                  this.style.background='';
              }
          }


    }

    var txt=document.getElementById('code');
    var txt1=document.getElementById('code1');
    //     num2.style.background='red'
    //
    function create()
    {var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
        var code="";
        for( var i=0; i <4; i++ )
            code+=possible.charAt(Math.floor(Math.random()*possible.length));
        return code;

    }
    window.onload=function()
    {
        txt.value=create();
        txt1.value=create();
    }

    txt.onclick=function()
    {
        txt.value=create();
    }

    txt1.onclick=function()
    {
        txt1.value=create();
    }
    $('.yanzheng>input')[0].onblur=function()
    {

        if(this.value=="")
        {
            this.nextElementSibling.nextElementSibling.className='name1';
//            this.value='请输入图片识别码';
            this.nextElementSibling.nextElementSibling.innerHTML='请输入图片识别码';
            return;
        }
        else{
            if(this.value.length==4)
            {
                if(this.value===txt.value)
                {
                    this.style.background='url(loginImages/right.png) no-repeat right';
                    this.nextElementSibling.nextElementSibling.innerHTML='';
                    this.nextElementSibling.nextElementSibling.className='';
                }
                else{
                    this.nextElementSibling.nextElementSibling.className='name1';
                    this.nextElementSibling.nextElementSibling.innerHTML='输入错误';
                    this.style.background='';
                }
            }
            else{this.nextElementSibling.nextElementSibling.className='name1';
                this.nextElementSibling.nextElementSibling.innerHTML='输入错误';
                this.style.background='';

            }

        }
    }

    $('.yanzheng>input')[2].onblur=function()
    {

        if(this.value=="")
        {
            this.nextElementSibling.nextElementSibling.className='name1';
//            this.value='请输入图片识别码';
            this.nextElementSibling.nextElementSibling.innerHTML='请输入图片识别码';
            return;
        }
        else{
            if(this.value.length==4)
            {
                if(this.value===txt.value)
                {
                    this.style.background='url(loginImages/right.png) no-repeat right';
                    this.nextElementSibling.nextElementSibling.innerHTML='';
                    this.nextElementSibling.nextElementSibling.className='';
                }
                else{
                    this.nextElementSibling.nextElementSibling.className='name1';
                    this.nextElementSibling.nextElementSibling.innerHTML='输入错误';
                    this.style.background='';
                }
            }
            else{this.nextElementSibling.nextElementSibling.className='name1';
                this.nextElementSibling.nextElementSibling.innerHTML='输入错误';
                this.style.background='';

            }

        }
    }
    $('.password>input')[0].onblur=function()
    {  if(this.value.trim().length==0)
    {this.nextElementSibling.innerHTML='必须输入密码';
        this.nextElementSibling.className='name1';
    }
    }
    $('.password>input')[0].onkeyup=function()
    { this.nextElementSibling.className='name1';
        if(this.value.length<6)
        {
            this.nextElementSibling.innerHTML='密码长度需要大于6位';
            document.getElementById("strengthLevel").className="strengthLv0";
        }
        else{
            this.nextElementSibling.innerHTML="";
            this.nextElementSibling.removeAttribute('class');
            var lvl=0;//级别
            if (/[0-9]/.test(this.value)) {//有数字则1
                lvl++;
            }
            if (/[a-zA-Z]/.test(this.value)) {//有字母则 2
                lvl++;
            }
            if (/[^0-9a-zA-Z]/.test(this.value)) {//特殊符号
                lvl++;
            }

            document.getElementById("strengthLevel").className="strengthLv"+lvl;
            if(lvl==1)
            {
                $('#strength').text('弱');
            }
            if(lvl==2)
            {
                $('#strength').text('中');
            }
            if(lvl==3)
            {
                $('#strength').text('强');
            }
        }


    }
    $('.password>input')[1].onblur=function()
    {  if(this.value.trim().length==0)
    {this.nextElementSibling.innerHTML='必须输入密码';
        this.nextElementSibling.className='name1';
    }
    }
    $('.password>input')[1].onkeyup=function()
    { this.nextElementSibling.className='name1';
        if(this.value.length<6)
        {
            this.nextElementSibling.innerHTML='密码长度需要大于6位';
            document.getElementById("strengthLevel").className="strengthLv0";
        }
        else{
            this.nextElementSibling.innerHTML="";
            this.nextElementSibling.removeAttribute('class');
            var lvl=0;//级别
            if (/[0-9]/.test(this.value)) {//有数字则1
                lvl++;
            }
            if (/[a-zA-Z]/.test(this.value)) {//有字母则 2
                lvl++;
            }
            if (/[^0-9a-zA-Z]/.test(this.value)) {//特殊符号
                lvl++;
            }

            document.getElementById("strengthLevel").className="strengthLv"+lvl;
            if(lvl==1)
            {
                $('#strength').text('弱');
            }
            if(lvl==2)
            {
                $('#strength').text('中');
            }
            if(lvl==3)
            {
                $('#strength').text('强');
            }
        }


    }

    $('.fix span').click(function(){
//       $('#feedback').animate({'right':0,'top':100},1000);

//        $('#feedback span').css('position','relative');
        $('#feedback').show(1000);
        $(this).hide();

//            $(this).addClass('fixx').removeClass('fix');
//        $(this).css('background',' url("loginImages/icons_feedback.png") -40px 0 no-repeat');
    });
    $('#feedback span').click(function(){
        $('#feedback').hide();
        $('.fix span').show(600);
    });
//    $('.fix span').mouseleave(function(){
//
////        $(this).css('background',' url("loginImages/icons_feedback.png") -1px 0 no-repeat');
//    });
    $('#choose>a').mouseenter(function(){
        $(this).css('opacity','1').siblings('opacity','0.5');
    });
    $('#choose>a').mouseleave(function(){
        $(this).css('opacity','0.5');
    });
//    var time=null;
//  time=setInterval(f1,20);
////    console.log(ul.offsetLeft);
//    function f1()
//    {
////        clearInterval(time);
//        var step=-10;
//
//        if($('#move')[0].offsetLeft<-5440)
//        {
//            $('#move')[0].style.left=0+'px';
//        }
//        else{
//            $('#move')[0].style.left=$('#move')[0].offsetLeft+step+'px';
//        }
//    }


//    $('#layer')[0].onmouseover=function()
//    {
//        clearInterval(time);
//    }
//
//    $('#layer')[0].onmouseout=function()
//    {clearInterval(time);
//        setInterval(f1,500);
//    }
</script>
</body>
</html>